{include file="public/header"/}
</head>
<body>
<div class="layui-form" id="LAY-component-layer-list">
    <div class="layui-fluid pd83">
        <div class="layui-col-sm12">
            <div class="layui-card pcf30">
                <input type="hidden" name="parent_id" id="parent_id" value="{$parent_id|default='0'}"/>
                <input type="hidden" name="grade" id="grade" value="{$grade|default='0'}">
                <input type="hidden" name="position_id" value="{$PosiData.position_id}">
                <div class="layui-form-item">
                    <label class="layui-form-label">导航位置</label>
                    <div class="layui-input-inline pcfcms_layui-input-inline">
                        <div style="line-height:36px;">{$PosiData.position_name}</div>
                    </div>
                </div>
                {if condition="!empty($Request.param.parent_id)"}
                <div class="layui-form-item">
                    <label class="layui-form-label">所属菜单</label>
                    <div class="layui-input-inline pcfcms_layui-input-inline">
                      <div style="line-height:36px;">{$pnavname}</div>
                    </div>
                </div>
                {/if}
                <div class="layui-form-item">
                    <label class="layui-form-label">生成菜单</label>
                    <div class="layui-input-inline">
                        <select lay-filter="FunctionData">
                            <option value="0" id="default" selected="true">功能页面</option>
                            {volist name="Function" id="vo"}
                                <option value="{$vo.code}" data-title="{$vo.title}">{$vo.title}</option>
                            {/volist}
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width:30px;line-height:36px;">或者</div>
                    <div class="layui-input-inline">
                        {$ArctypeHtml|raw}
                    </div>
                    <div class="layui-input-inline w100">
                        <input type="checkbox" lay-skin="primary" name="arctype_sync" id="arctype_sync" lay-filter="arctype_sync" value="1" title="栏目同步">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><b class="pcfts">*</b> 菜单名称</label>
                    <div class="layui-input-inline pcfcms_layui-input-inline">
                     <input type="text" name="nav_name" id="nav_name" value="" lay-verify="required" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" id="dl_nav_url">
                    <label class="layui-form-label"><b class="pcfts">*</b> 菜单链接</label>
                    <div class="layui-input-inline pcfcms_layui-input-inline">
                     <input type="text" name="nav_url" id="nav_url" value="" lay-verify="required" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="margin-bottom:5px;">
                    <label class="layui-form-label">菜单副名</label>
                    <div class="layui-input-inline pcfcms_layui-input-inline">
                        <input type="text" name="englist_name" value="" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="margin-bottom:0;margin-top:0;">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-block">副名可用作栏目英文名、副标题等用途，若不用可不必填写</div>
                </div>

                <div class="layui-form-item" style="margin-bottom:5px;">
                    <label class="layui-form-label">菜单图标</label>
                    <div class="layui-input-inline auto">
                    <ul class="layout">
                      <li>
                      <input name="nav_pic" id="nav_pic" placeholder="图片地址" value="" class="layui-input inp inp_logo">
                      <img id="img_nav_pic" src="{:get_default_pic()}" class="none">
                      </li>
                      <li style="margin-top:3px;margin-left:5px;">
                        <div class="layui-btn-group">
                          <input type="button" value="上传图片" class="layui-btn layui-btn-sm pcfcms-upload" lay-data="{number:1,pcf_inputId:'nav_pic',pcf_savepath:'allimg'}">
                          <input type="button" value="选择图片" class="layui-btn layui-btn-sm" onClick="GetPictureFolder(1,'nav_pic');">
                          <input type="button" value="预览" class="layui-btn layui-btn-sm" onclick="BigImages($('#img_nav_pic').attr('src'));">
                          <input type="button" value="清除" class="layui-btn layui-btn-sm layui-btn-warm" data-inputid="nav_pic" onclick="DelImages(this);">
                        </div>
                      </li>
                    </ul>
                  </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">链接属性</label>
                    <div class="layui-input-inline pcfcms_layui-input-inline">
                        <input type="checkbox" lay-skin="primary" name="target" value="1" title="新窗口打开">
                        <input type="checkbox" lay-skin="primary" name="nofollow" value="1" title="nofollow">
                    </div>
                </div>
            </div>
        </div>
        <div class="pcfclear"></div>
    </div>
    <div class="submit-info text-center">
        <button class="layui-btn" lay-submit lay-filter="formSubmit">确认提交</button>
        <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
    </div>
</div>
{include file="public/footer"/}
<script>
    layui.use(['layer', 'form'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;

        //所属菜单
        form.on('select(parent_id)', function(data){
            var value   = data.value;
            if (0 == value) {
                grade = 0;
            } else {
                var grade = $(data.elem).find("option:selected").attr('data-grade');
                grade = parseInt(grade) + 1;
            }
            $('input[name=grade]').val(grade);
        });

        //选中功能页面
        form.on('select(FunctionData)', function(data){
            var url   = data.value;
            var title = $(data.elem).find("option:selected").attr('data-title');
            if (url) $('#nav_url').val(url);
            if (title) $('#nav_name').val(title);
            $("#arctype_default").attr("selected", true);
            $('#arctype_sync').attr("checked", false);
            $('#nav_name').attr("readonly", false).css('background-color','');
            $('#nav_url').attr("readonly", false).css('background-color','');
            $('#dl_nav_url').hide();
            form.render();
        });

        //加载栏目信息
        form.on('select(type_id)', function(data){
            var obj = data.elem;
            var type_name = $(obj).find("option:selected").attr('data-typename');
            var type_url  = $(obj).find("option:selected").attr('data-typeurl');
            if (type_name) $('#nav_name').val(type_name);
            if (type_url) $('#nav_url').val(type_url);
            $("#default").attr("selected", true);
            $('#dl_nav_url').show();
            form.render();
        });

        //同步栏目
        form.on('checkbox(arctype_sync)', function (data) {
            var obj = data.elem;
            var type_id = $('#type_id').val();
            if (type_id && type_id > 0) {
                if ($(obj).attr('checked')) {
                    // 选中
                    $('#nav_name').attr("readonly", true).css('background-color','#f5f5f5');
                    $('#nav_url').attr("readonly", true).css('background-color','#f5f5f5');
                    $('#dl_nav_url').hide();
                } else {
                    // 取消选中
                    $('#nav_name').attr("readonly", false).css('background-color','');
                    $('#nav_url').attr("readonly", false).css('background-color','');
                    $('#dl_nav_url').show();
                }
            } else {
                layer.msg("请先选择栏目",{icon:2,time:1000});
                $(obj).attr('checked', false);
            }
            form.render();
        });

        //监听开关
        form.on('switch(status)', function(data){
          var elemId = data.elem.attributes['lay-filter']['nodeValue'];
          if (data.elem.checked) {
            this.value = 1;
          } else {
            this.value = 0;
          }
          $("input[name='"+elemId+"']").val(this.value);
        });

        //监听提交
        form.on('submit(formSubmit)',function(data){
            layer.msg('正在处理请勿刷新页面', {icon: 16,shade: 0.01,time:3600000});
            $.ajax({
                type : "post",
                url : "{:url('/nav/add')}",
                data : data.field,
                dataType : 'json',
                success : function(res){
                    layer.closeAll('loading');
                    if(res.status){
                        layer.msg(res.msg,{icon:1,time:1000},function(){
                            parent.window.location.href = res.url;
                        });
                    }else{
                       layer.msg(res.msg,{icon:2,time:1000});
                    }
                },
                error: function(e){
                    layer.closeAll('loading');
                    layer.msg("未知错误，操作中断！",{icon:2,time:1000});
                }
            });
        });

    });
</script>
</body>
</html>